"use strict"
const head = document.querySelector('head')
const switchBut = document.querySelector('.switch-button')
const switchBut2 = document.querySelector('.switch-button-desktop')

const getId = (idLength) => {
    const symbols = "abcdefghijklmnopqrstuvwxyz0123456789"
    let id = ""
    for (let length = 0; length < idLength; length++) {
        id += symbols[Math.floor(Math.random() * 36)]
    }
    return id
}

const addLink = (filePath, rel, id) => {
    const link = document.createElement('link')
    link.rel = rel
    link.href = filePath
    link.id = id
    head.appendChild(link)
}

const removeLink = (id) => {
    const links = document.querySelectorAll('link')
    links.forEach(link => {
        link.id === id ? head.removeChild(link) : false
    })
}

const trigger = (i = 0, id = getId(8)) => {
    return () => {
        if (i === 0) {
            addLink('css/dark.css', 'stylesheet', id)
            i++
        } else {
            removeLink(id)
            i--
        }
        return i
    }
}

const themeSwitcher = trigger()

switchBut.addEventListener('click', themeSwitcher)
switchBut2.addEventListener('click', themeSwitcher)